CSS Custom Properties
Sass
や
css function
の兼ね合い
上手く変換されない場合ある
CSS変数に色のHEX値を入れると rgba() が使えないので RGB値も変数にする - Qiita
変換順序考える必要ある?
CIE RGB 表色系
を用意
CSS変数による配色はcontrastとrgbも用意したら捗るぞ
初期準備について
SCSS
でうまく自動生成する
css/color-modes.scss at main · primer/css
Dark ダーク UI
との兼ね合い
custom-property &scss
使ってみて
そのclassファイル内で変数で書き換えすぎると、各classに依存関係が出来て、命名や扱いに制限ができてしまう
過度に変数でまとめる必要はなさそう
cmd + f で、同じサイズ使っていれば分かる。
参考
CSS Custom Properties for Cascading Variables Module Level 1
A Complete Guide to Custom Properties | CSS-Tricks
Two options for using custom properties - QuirksBlog
必要性がわかりやすい
CSS Custom Properties (vars) with SASS/SCSS, a practical architecture strategy - DEV Community
Custom properties with defaults: 3+1 strategies – Lea Verou